import Vue from 'vue'
import VueRouter from 'vue-router'

import store from '../store'

Vue.use(VueRouter)

const routes = [
  {
    name: 'Login',
    path: '/login',
    component: () => import('@/views/login/login.vue') 
    /*
        路由 懒加载
        的优点： 在需要的时候 进行加载， 节省空间提高效率
    */ 
  },
  {
    name: 'main',
    path: '/', 
    component: () => import('@/layout'),
    redirect: '/dashbord',
    children: [
      {
        name: 'Dashbord',
        path: '/dashbord', 
        component: () => import('@/views/dashbord')
      },
      {
        name: 'Users',
        path: '/users', 
        component: () => import('@/views/users')
      }
    ]
  },
  {
    name: '404',
    path: '*', // * 可以 匹配任何路径， 但是前提是 router 中没有相应的路径配置才可以， 
    component: () => import('@/views/404')
  }
]

const router = new VueRouter({
  // mode: 'history',
  // base: process.env.BASE_URL,
  routes
})

// 导航守卫
router.beforeEach(function (to, from, next) {
  if (to.path === '/login') {
    next()
  } else {
    // 判断是否有 token 如果有 token 就放行 否则跳转到登录页面
    if (store.state.token) {
      next()
    }else {
      next('/login')
    }
  }
})

export default router
